<template>
    <div id="basicLayout">
        <a-layout style="height: 100vh;">
            <a-layout-content class="content">
                <a-scrollbar style="height:880px;overflow: auto;" scrollLeft="0">
                    <div style="height: 2000px;width: 2000px; background-color: #CBE6FA;">
                        <chat-card></chat-card>
                    </div>
                </a-scrollbar>
            </a-layout-content>
            <a-layout-footer class="footer">
                <SendBarCard></SendBarCard>
            </a-layout-footer>
        </a-layout>
    </div>
</template>

<script setup>

import SendBarCard from "@/views/user/chat/sendbar/SendBarCard.vue";
import ChatCard from "@/views/user/chat/message/ChatCard.vue";
</script>

<style scoped>
.footer{
    color: gray;
    padding-bottom: 16px;
    text-align: center;
}

#basicLayout .content{
    max-width: 1200px;
    width: 100%;
    box-sizing: border-box;
    margin: 0 auto 28px;
    padding: 20px;
    /*background: linear-gradient(to right, #fefefe, #fff);*/
    /*border: 2px solid black;*/
}

#basicLayout .header{
    margin-bottom: 16px;
    box-shadow: #eee 1px 1px 5px;
}
</style>